<template>
	<!-- 实例详情 -->
    <div class="payways-case-details">
      <!-- 导航 -->
      <tz-breadcrumb  :pathArr='[{"name": "商家"},{"name": "支付通道实例", "url": "/payways-case-list"},{"name": "实例详情", "url": "/payways-case-details"}]'></tz-breadcrumb>
      <!-- 数据表单 -->
<div style="margin: 20px;"></div>
<el-card class="box-card">
  <div class="text item">
      <el-tabs value="casebaseinfo">
    <el-tab-pane label="基本信息" name="casebaseinfo">
      <!-- 实例信息 -->
      <el-form class="" label-width="120px">
        <!--<el-form :label-position="labelPosition" class="" label-width="120px">-->
        <el-form-item label="商户名称">
          <el-input class="form-input" v-model="tableData.store_name" disabled=""></el-input>
        </el-form-item>
        <el-form-item label="通道类型">
          <el-input  class="form-input" v-model="tableData.payways_type_z" disabled=""></el-input>
        </el-form-item>
        <el-form-item label="通道实例ID">
          <el-input  class="form-input" v-model="tableData.ways_id" disabled=""></el-input>
        </el-form-item>
        <el-form-item label="费率">
          <el-input  class="form-input" v-model="tableData.rate"></el-input>
        </el-form-item>
        <el-form-item label="创建时间">
          <el-input  class="form-input" v-model="tableData.created_time" disabled=""></el-input>
        </el-form-item>
        <el-form-item label="更新时间">
          <el-input  class="form-input" v-model="tableData.updated_time" disabled=""></el-input>
        </el-form-item>
        <img src="" width="300px">
        <el-form-item>
          <el-button type="primary" @click="editRate()" v-loading.fullscreen.lock="fullscreenLoading">保存修改</el-button>
        </el-form-item>
      </el-form>
    </el-tab-pane>
    <el-tab-pane label="权限控制" name="permissions">
      收款，退款，结算，过期结算
      <br>
      <el-button type="success" plain v-if="tableData.payways_status" @click="EditRule( tableData.ways_id,0,tableData.store_code,'payways_status',0 )" size="mini">已开启支付通道</el-button>
      <el-button type="danger" plain v-if="tableData.payways_status === 0" @click="EditRule( tableData.ways_id,tableData.store_code,'payways_status',1 )" size="mini">已关闭支付通道</el-button>
      <el-button type="success" plain v-if="tableData.receivables" @click="EditRule( tableData.ways_id,tableData.store_code,'receivables',0 )" size="mini">已开启收款</el-button>
      <el-button type="danger" plain v-if="tableData.receivables === 0" @click="EditRule( tableData.ways_id,tableData.store_code,'receivables',1 )" size="mini">已关闭收款</el-button>
      <el-button type="success" plain v-if="tableData.refunt_status" @click="EditRule( tableData.ways_id,tableData.store_code,'refunt_status',0 )" size="mini">已开启退款</el-button>
      <el-button type="danger" plain v-if="tableData.refunt_status === 0" @click="EditRule( tableData.ways_id,tableData.store_code,'refunt_status',1 )" size="mini">已关闭退款</el-button>
      <el-button type="success" plain v-if="tableData.deposit_impower" @click="EditRule( tableData.ways_id,tableData.store_code,'deposit_impower',0 )" size="mini">已开启预授权</el-button>
      <el-button type="danger" plain v-if="tableData.deposit_impower === 0" @click="EditRule( tableData.ways_id,tableData.store_code,'deposit_impower',1 )" size="mini">已关闭预授权</el-button>
      <el-button type="success" plain v-if="tableData.revoke_fundauth" @click="EditRule( tableData.ways_id,tableData.store_code,'revoke_fundauth',0 )" size="mini">已开启撤销预授权</el-button>
      <el-button type="danger" plain v-if="tableData.revoke_fundauth === 0" @click="EditRule( tableData.ways_id,tableData.store_code,'revoke_fundauth',1 )" size="mini">已关闭撤销预授权</el-button>
      <el-button type="success" plain v-if="tableData.fundauth_pay" @click="EditRule( tableData.ways_id,tableData.store_code,'fundauth_pay',0 )" size="mini">已开启结算</el-button>
      <el-button type="danger" plain v-if="tableData.fundauth_pay === 0" @click="EditRule( tableData.ways_id,tableData.store_code,'fundauth_pay',1 )" size="mini">已关闭结算</el-button>
      <el-button type="success" plain v-if="tableData.ewn_impower" @click="EditRule( tableData.ways_id,tableData.store_code,'ewn_impower',0 )" size="mini">已开启扫码授权</el-button>
      <el-button type="danger" plain v-if="tableData.ewn_impower === 0" @click="EditRule( tableData.ways_id,tableData.store_code,'ewn_impower',1 )" size="mini">已关闭扫码授权</el-button>
      <el-button type="success" plain v-if="tableData.tomorrow_settlement" @click="EditRule( tableData.ways_id,tableData.store_code,'tomorrow_settlement',0 )" size="mini">已开启隔日结算</el-button>
      <el-button type="danger" plain v-if="tableData.tomorrow_settlement === 0" @click="EditRule( tableData.ways_id,tableData.store_code,'tomorrow_settlement',1 )" size="mini">已关闭隔日结算</el-button>
      <el-button type="success" plain v-if="tableData.sms_pre_authorization" @click="EditRule( tableData.ways_id,tableData.store_code,'sms_pre_authorization',0 )" size="mini">已开启短信预授权</el-button>
      <el-button type="danger" plain v-if="tableData.sms_pre_authorization === 0" @click="EditRule( tableData.ways_id,tableData.store_code,'sms_pre_authorization',1 )" size="mini">已关闭短信预授权</el-button>
      <el-button type="success" plain v-if="tableData.add_settlement" @click="EditRule( tableData.ways_id,tableData.store_code,'add_settlement',0 )" size="mini">已开启追加结算</el-button>
      <el-button type="danger" plain v-if="tableData.add_settlement === 0" @click="EditRule( tableData.ways_id,tableData.store_code,'add_settlement',1 )" size="mini">已关闭追加结算</el-button>
    </el-tab-pane>
  </el-tabs>
  </div>
</el-card>

    </div>
</template>

<script>
import api from './../../api/api';
import http from './../../config/index';
import tzBreadcrumb from './../../components/breadcrumb/breadcrumb.vue';
export default {
  components: {
    'tz-breadcrumb': tzBreadcrumb
  },
  data () {
    return {
      // 表单数据
      tableData: [],
      fullscreenLoading: false,
      payTypeOptions: {
        store_code: '',
        type: '',
        id: '',
        field: '',
        value: '',
        pass: ''
      }
    };
  },
  created () {
    this.requestData();
  },
  methods: {
    requestData () {
      let that = this;
      http.post(api.PaywayDetails, {
        token: localStorage.getItem('token'),
        ways_id: that.$route.query.ways_id
      }, response => {
        console.log(response);
        if (response.code === 10001 || response.code === '10001') {
          let type = {
            'alipay': '支付宝',
            'weixin': '微信',
            'sfbank': '银行卡'
          };
          response.data[0].res.payways_type_z = type[response.data[0].res.payways_type];
          that.tableData = response.data[0].res;
        } else {
          that.tableData = [];
        }
      }, err => {
        console.log(err);
      });
    },
    // 添加通道实例
    EditRule (waysId, storeCode, field, value) {
      let that = this;
      that.payTypeOptions.ways_id = waysId;
      that.payTypeOptions.store_code = storeCode;
      that.payTypeOptions.field = field;
      that.payTypeOptions.value = value;
      that.editConfirmPass();
    },
    editConfirmPass () {
      let that = this;
      // that.$prompt('请输入修改密码', '', {
      //   confirmButtonText: '确定',
      //   cancelButtonText: '取消',
      //   inputType: 'password'
      // }).then(({ value }) => {
      //   that.payTypeOptions.pass = value;
      //   that.paywaysRuleSave();
      // }).catch(() => {
      //   that.$message({
      //     type: 'info',
      //     message: '取消输入'
      //   });
      // });
      that.paywaysRuleSave();
    },
    paywaysRuleSave () {
      let that = this;
      http.post(api.RuleSave, {
        token: localStorage.getItem('token'),
        saveType: 'way',
        ways_id: that.payTypeOptions.ways_id,
        store_code: that.payTypeOptions.store_code,
        fields: that.payTypeOptions.field,
        value: that.payTypeOptions.value
      }, response => {
        console.log(response);
        if (response.code === 10001 || response.code === '10001') {
          // that.tableData.rule_id = response.data[0].res;
          that.tableData[that.payTypeOptions.field] = that.payTypeOptions.value;
          that.$message({
            message: '修改成功',
            type: 'success'
          });
        } else {
          that.$message({
            message: response.msg,
            type: 'warning'
          });
        }
      }, err => {
        console.log(err);
      });
    },
    editRate () {
      let that = this;
      that.fullscreenLoading = !that.fullscreenLoading;
      http.post(api.PaywayRateEdit, {
        token: localStorage.getItem('token'),
        ways_id: that.tableData.ways_id,
        rate: that.tableData.rate
      }, response => {
        console.log(response);
        that.fullscreenLoading = !that.fullscreenLoading;
        if (response.code === 10001 || response.code === '10001') {
          that.$message({
            message: '修改成功',
            type: 'success'
          });
        } else {
          that.$message({
            message: response.msg,
            type: 'warning'
          });
        }
      }, err => {
        console.log(err);
        that.fullscreenLoading = !that.fullscreenLoading;
      });
    }
  }
};
</script>

<style lang="stylus" scoped>
.form {
  padding: 2rem;
  padding-right: 200px;
  margin-top: 15px;
  margin-bottom: 12px;
  box-sizing: border-box;
  background: #fff;
  box-shadow: 1px 1px 1px #999;

  .form-item {
    display: inline-block;
    margin-right: 35px;

    label {
      font-size: 14px;
      color: #333;
      width: 200px;
      display: inline-block;
    }

    .form-input, .form-select {
      width: 200px;
    }
  }

  .line {
    height: 15px;
  }
}

.server-item {
  width: 20px;
  height: 20px;
  margin: 5px;
}
</style>
